<!DOCTYPE html>
<html>
<head>
{{template "common_header.html" .}}
    <style>
        .btn-float{
            display: inline-block;
            float: left;
            margin-left:5px;
            margin-top:5px;
        }
    </style>
</head>
<body>
<div class="x-nav">
    <span class="layui-breadcrumb">
        <a href="javascript:void(0);">首页</a>
        <a href="">管理员管理</a>
        <a><cite>APP管理</cite></a>
    </span>
    <a class="layui-btn layui-btn-normal layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i>
    </a>
</div>
<div class="x-body layui-anim layui-anim-up">
    <div class="layui-collapse">
        <div class="layui-colla-item">
            <h2 class="layui-colla-title">筛选</h2>
            <div class="layui-colla-content layui-show">
                <form action="/appList" class="layui-form" method="get">
                    <div class="layui-form-item layui-inline">
                        <label class="layui-form-label">数据ID</label>
                        <div class="layui-input-block">
                            <input type="text" name="id" placeholder="数据ID" autocomplete="off" class="layui-input" value="{{.query.id}}">
                        </div>
                    </div>
                    <div class="layui-form-item layui-inline">
                        <label class="layui-form-label">APP名称</label>
                        <div class="layui-input-block">
                            <input type="text" name="app_name" placeholder="APP名称" autocomplete="off" class="layui-input" value="{{.query.app_name}}">
                        </div>
                    </div>
                    <div class="layui-form-item layui-inline">
                        <div class="layui-input-block" style="margin-left:100px;">
                            <button class="layui-btn layui-btn-normal layui-inline">查询</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <xblock>
        <button class="layui-btn layui-btn-danger" id="all-item-delete"><i class="layui-icon"></i>批量删除</button>
        <button class="layui-btn layui-btn-normal" onclick="x_admin_show('添加APP','/addApp', 500, 300)"><i class="layui-icon"></i>添加</button>
        <span class="x-right" style="line-height:40px">共有数据：{{.total}} 条</span>
    </xblock>
    <table class="layui-table">
        <colgroup>
            <col width="50">
            <col>
            <col>
            <col>
            <col width="80">
            <col width="130">
        </colgroup>
        <thead>
        <tr>
            <th>
                <div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
            </th>
            <th style="text-align:center;">APP名称</th>
            <th style="text-align:center;">创建人</th>
            <th style="text-align:center;">创建时间</th>
            <th style="text-align:center;">详情</th>
            <th style="text-align:center;">操作</th>
        </tr>
        </thead>
        <tbody>
        {{range $index,$item := .appList}}
        <tr style="text-align:center;">
            <td>
                <div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='{{$item.id}}'><i class="layui-icon">&#xe605;</i></div>
            </td>
            <td>{{$item.app_name}}</td>
            <td>{{$item.admin_name}}</td>
            <td>
                {{$item.create_date}}
            </td>
            <td>
                <button class="layui-btn layui-btn-sm layui-btn-normal btn-float item-model-show" style="margin-left:5px;" app_id="{{$item.id}}">查看</button>
                <input type="hidden" id="{{$item.id}}_callback_url" value="{{$item.callback_url}}">
                <input type="hidden" id="{{$item.id}}_app_key" value="{{$item.app_key}}">
                <input type="hidden" id="{{$item.id}}_app_secret" value="{{$item.app_secret}}">
            </td>
            <td>
                <button class="layui-btn layui-btn-sm layui-btn-normal btn-float" onclick="x_admin_show('编辑APP','/updateApp?id={{$item.id}}', 500, 300)">编辑</button>
                <button class="layui-btn layui-btn-sm layui-btn-danger btn-float item-model-delete" style="margin-left:5px;" app_id="{{$item.id}}">删除</button>
            </td>
        </tr>
        {{end}}
        </tbody>
    </table>
    {{template "pager.html" .}}
</div>
{{template "common_js.html" .}}
<script>
    //JavaScript代码区域
    layui.use('element', function(){
        var element = layui.element;
    });

    $(function () {
        // 查看
        $('.item-model-show').click(function () {
            var app_id = $(this).attr("app_id");
            var callback_url = $("#" + app_id + "_callback_url").val();
            var app_key = $("#" + app_id + "_app_key").val();
            var app_secret = $("#" + app_id + "_app_secret").val();
            var dom = '<p>回调地址 : ' + callback_url + '</p>';
            dom += '<p>APP KEY : ' + app_key + '</p>';
            dom += '<p>APP SECRET : ' + app_secret + '</p>';
            var mylayer = layer.open({
                title: '查看APP详情',
                area: ['500px', '260px'],
                btn: ['确定', '取消'],
                content: dom,
            });
        });

        $('.item-model-delete').click(function () {
            var id = $(this).attr("app_id");
            var mylayer = layer.open({
                title: '删除APP',
                btn: ['确定', '取消'],
                content: '你确定要删除这个APP吗？',
                yes: function(index, layero){
                    var url = '/doDeleteApp';
                    var data = {
                        id:id
                    };
                    $.post(url, data, function(resp) {
                        if(resp.en == 200) {
                            layer.msg(resp.em);
                            setTimeout(function(){
                                window.location.reload();
                            },1000);
                        } else {
                            layer.msg(resp.em);
                            layer.close(mylayer);
                        }
                    });
                },
            });
        });

        // 批量删除APP
        $('#all-item-delete').click(function () {
            var ids = new Array();
            $('.layui-form-checked').each( function( index, val) {
                var id = $(val).attr('data-id');
                if(id !== undefined && id !== '') {
                    ids.push(id);
                }
            });
            if(ids.length === 0) {
                return;
            }
            var mylayer = layer.open({
                title: '删除APP',
                btn: ['确定', '取消'],
                content: '你确定要删除已选中的APP吗？',
                yes: function(index, layero){
                    var url = '/doDeleteAppBatch';
                    var data = {
                        ids:ids.join(",")
                    };
                    $.post(url, data, function(resp) {
                        if(resp.en == 200) {
                            layer.msg(resp.em);
                            setTimeout(function(){
                                window.location.reload();
                            },1000);
                        } else {
                            layer.msg(resp.em);
                            layer.close(mylayer);
                        }
                    });
                },
            });
        });

    });
</script>
{{template "pager_js.html" .}}
</body>
</html>